﻿@using mBlog.Helpers

@model mBlog.ViewModels.CommentInput
<h3 id="respond">
    发表评论</h3>
@using (Html.BeginForm("AddComment", "Post", FormMethod.Post))
{ 
    @Html.Hidden("PostId", Model.PostId);
    @Html.ValidationSummary();
    <p>
        <label for="Author">
            昵称：</label>
             @Html.EditorFor( x => x.Author)
    </p>
    <p>
        <label for="Email">
            邮箱：</label>
            @Html.EditorFor( x => x.Email)
    </p>
    <p>
        <label for="Site">
            主页：</label> @Html.EditorFor(x => x.Site)
    </p>    
    <div>
        <!-- markItUp! skin -->
        <link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/markitup/skins/markitup/style.css")" />
        <!--  markItUp! toolbar skin -->
        <link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/markitup/sets/default/style.css")" />
        <!-- markItUp! toolbar settings -->
        <script type="text/javascript" src="@Url.Content("~/Content/markitup/sets/default/set.js")"></script>
        <!-- markItUp! -->
        <script type="text/javascript" src="@Url.Content("~/Content/markitup/jquery.markitup.js")"></script>
        @Html.TextAreaFor( x => x.Content, new {@class="content markItUpEditor required", id="commentMarkup"})
        <div id="preview">
        </div>
        <br />
        @Html.GenerateCaptcha()
        <input type="submit" value="发表评论" />
    </div>
}
<script type="text/javascript" src="@Url.Content("~/Scripts/showdown.js")"></script>
<script type="text/javascript">
    $('#commentMarkup').markItUp(mySettings);
    var $textarea = $('#commentMarkup'),
            $preview = $('#preview');
    converter = new Showdown.converter();
    $textarea.keyup(function () {
        $preview.html(converter.makeHtml($textarea.val()));
    }).trigger('keyup');

</script>

@*<script type="text/javascript">
    $('#commentForm').validate({
        rules: {
            Author: "required",
            Email: {
                required: true,
                email: true
            },
            Content: {
                required: true,
                minlength: 5
            }
        },
        messages: {
            Author: "",
            Email: {
                required: "",
                email: "Email地址不合法"
            },
            Content: {
                required: "",
                minlength: jQuery.format("同学，请多写一点吧")
            }
        },

        highlight: function (element, errorClass) {
            $(element).css("border", "1px red solid");
        }
    });
</script>*@
@*<link href="@Url.Content("~/Content/Stylesheets/ui-lightness/jquery-ui-1.8.9.custom.css")" rel="stylesheet" type="text/css" />
<script type="text/javascript">
    $('#openIdLogin').click(function () {
        $('#openIdLoginDiv').dialog();
    });
</script>*@ @*<div id="openIdLoginDiv">
    <form id="openid-form" method="post" action="@Url.Action("OpenIdLogin", "Account")">
    <ul>
        <li id="google">
            <img src="@Url.Content("~/Content/Images/openIds/google.gif")" /></li>
        <li id="openid">
            <img src="@Url.Content("~/Content/Images/openIds/openid.png")" /></li>
        <li id="yahoo">
            <img src="@Url.Content("~/Content/Images/openIds/yahoo.gif")" /></li>
    </ul>
    @Html.Hidden("postUrl", Model.PostUrl);
    <input type="text" name="openIdUrl" id="openIdUrl" />
    <a id="signin">Sign In »</a>
    </form>
    <script type="text/javascript">
        var providers = {
            myopenid: { action: '@Url.Action("OpenIdLogin", "Account")', url: 'http://myopenid.com' },
            facebook: { action: '@Url.Action("OpenIdLogin", "Account")', url: 'http://facebook.com' },
            google: { action: '@Url.Action("OpenIdLogin", "Account")', url: 'http://www.google.com/accounts/o8/id' },
            yahoo: { action: '@Url.Action("OpenIdLogin", "Account")', url: 'http://yahoo.com' }
        };

        $("#signin").click(function () {
            $("#openid-form").submit();
        });

        $("li").not("#openid").click(function () {
            $("#other").hide(500);
            isHidden = true;
            var id = $(this).attr("id");
            var provider = providers[id];
            if (provider.action != undefined) {
                $("#openid-form").attr("action", provider.action);
            }
            if (provider.url != undefined) {
                $("#openIdUrl").val(provider.url);
            }
            $("#openid-form").submit();
        });

        var isHidden = true;
        function toggleOther() {
            if (isHidden) {
                $("#other").slideDown(500);
            } else {
                $("#other").slideUp(500);
            }
            isHidden = !isHidden;
        }

    </script>
</div>*@ 